<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <style>
    main{
      width: 90%;
      margin: auto;
      position: relative;
    }
    article{
      min-height: 250px;
      border-bottom: 1px solid #ccc;
      text-indent: 2em;
      margin-top: 20px;
    }
    main p{
      text-align: right;
      padding-right: 20px;
      margin: 10px 0;
    }
    main a{
      position: absolute;
      bottom: 10px;
    }
    .form-group{
      overflow: hidden;
    }
    .reply{
      list-style-type:none;
      margin: 10px 0;
      padding: 0;
    }
    .reply li{
      border-bottom:1px solid #999999;
      padding-left: 40px;
      position: relative;
    }
    .remove{
      position: absolute;
      right: 10px;
      top: 5px;
      background: red;
      color: white;
      border-radius: 50%;
      padding: 0 5px;
    }
    .remove:hover{
      text-decoration: none;
      color: white;
    }

  </style>
</head>
<body>
  {{include './header.html'}}
  <main>
    <article>{{data.content}}</article>
    <p>作者: {{data.author.account}}</p>
    <p>发布时间: {{data.times}}</p>
    {{if user&&data.author.account==user.account}}
    <a href="/delete-blog?id={{data._id}}">删除该篇博客</a>
    {{/if}}
  </main>

  <!-- 留言区 -->
  <!-- 留言内容 -->
  <div class="container">
    <hr>
    <span style="font-size: 17px; font-weight: bold;">留言区：</span>
    <ul class="reply">
      {{each data.reply reply i}}
      <li>
        <p>{{reply.content}}</p>
        <p style="text-align: right;">{{reply.account}}</p>
        <p style="text-align: right;">{{reply.times}}</p>
        {{if user&&reply.account==user.account}}
        <a href="/delete-reply?id={{reply._id}}&blog_id={{data._id}}&title={{data.title}}" class="remove">&times;</a>
        {{/if}}
      </li>
      {{/each}}
    </ul>
  </div>

 

  <div class="container">
      <form action="/api/reply?id={{data._id}}" method="post">
        <!-- <div class="form-group">
          <label for="" class="col-md-1 text-right">昵称:</label>
          <div class="col-md-7">
            <input type="text" class="form-control" placeholder="昵称" name="account" required>
          </div>
        </div> -->
        <div class="form-group">
          <label for="" class="col-md-1 text-right">内容:</label>
          <div class="col-md-7">
            <textarea name="content" id="" cols="30" rows="10" class="form-control" required></textarea>
          </div>
        </div>
        <div class="form-group col-md-7 col-md-offset-1" >
           <button class="btn btn-primary form-control">提交</button>
        </div>
       
      </form>
  </div>

  
</body>
</html>